<template>
  <main>
    <sidebar></sidebar>
    <div class="user-info">
      <table class="table table-hover table-center">
        <thead>
        <tr>
          <th class="table-center">姓名</th>
          <th class="table-center">照片</th>
          <th class="table-center">职位</th>
          <th class="table-center">操作</th>
        </tr>
        </thead>
        <tbody>
        <tr>
          <td>1</td>
          <td>Mark</td>
          <td>Otto</td>
          <td>@mdo</td>
        </tr>
        <tr>
          <td>2</td>
          <td>Jacob</td>
          <td>Thornton</td>
          <td>@fat</td>
        </tr>
        <tr>
          <td>3</td>
          <td>Larry</td>
          <td>the Bird</td>
          <td>@twitter</td>
        </tr>
        </tbody>
      </table>
    </div>
  </main>
</template>

<script>
  import Sidebar from './Sidebar.vue'
  export default {
    name : 'user',
    data: function () {
      return {

      }
    },
    components: {
      'sidebar': Sidebar
    },
  }
</script>

<style>
  main {
    display: flex;
    justify-content: space-between;
    flex: 1;
  }
  .user-info {
    flex: 1;
  }
  .table-center {
    text-align: center;
  }


</style>
